<template>
	<view>
		<!-- 导航栏 -->
		<cu-custom bgColor="bg-gradual-red" :isBack="false">
			<block slot="backText">返回</block>
			<block slot="content">登录</block>
		</cu-custom>
		<form>
			<view class="cu-form-group margin-top-sm">
				<view class="title text-bold">用户名</view>
				<input class="" placeholder="请输入用户名" name="userName" v-model="userName"></input>
			</view>
			<view class="cu-form-group margin-top-sm">
				<view class="title text-bold">密　码</view>
				<input class="" type="password" placeholder="请输入密码" name="password" v-model="password"></input>
			</view>
		</form>
		<view class="padding flex flex-direction">
			<button class="cu-btn bg-purple lg" @tap="bindLogin">登录</button>
			<button class="cu-btn bg-grey lg margin-top-sm" @tap="to_chang">切换服务器</button>
			<!-- <button class="cu-btn bg-red margin-tb-sm lg">嫣红</button> -->
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	
	export default {
		computed: mapState(['forcedLogin','server']),
		data() {
			return {
				userName:'',
				password:''
			}
		},
		methods: {
			...mapMutations(['login','setName','setDeptName','setPwd','setRoles','changUrl']),
			bindLogin(){
				if(this.userName.length<1){
					uni.showToast({
						title: '用户名不能为空',
						icon: 'none'
					});
					return;
				}
				if(this.password.length<1){
					uni.showToast({
						title: '密码不能为空',
						icon: 'none'
					});
					return;
				}
				uni.request({
					url: this.server.url + 'app/login',
					method: 'GET',
					// sslVerify: false,
					data: {pig:this.userName,dog:encode64(this.password)},
					success: res => {
						var result=res.data;
						if(result.ok){
							// 向全局变量里存值
							this.setName(result.name);
							this.setDeptName(result.deptName);
							this.setPwd(this.password);
							this.setRoles(result.roles);
							// 跳转主页面
							this.toMain(this.userName);
						}else{
							uni.showToast({
								title: result.msg,
								icon: 'none'
							});
						}
					},
					fail: () => {
						uni.showToast({
							title: '网络连接失败...',
							icon: 'none'
						});
					}
				});
			},
			toMain(userName){
				this.login(userName);
				/* uni.navigateTo({
					url: '../index/index',
				}); */
				uni.redirectTo({
					url: '../index/index'
				});
			},
			to_chang(){
				this.changUrl();
				uni.showToast({
					title: '服务器：'+this.server.name,
					icon: 'none'
				});
				
			}
		}
	}
	function encode64(input) {
		var keyStr = "ABCDEFGHIJKLMNOP" + "QRSTUVWXYZabcdef" + "ghijklmnopqrstuv"
					+ "wxyz0123456789+/" + "=";var output = "";
		var chr1, chr2, chr3 = "";
		var enc1, enc2, enc3, enc4 = "";
		var i = 0;
		do {
			chr1 = input.charCodeAt(i++);
			chr2 = input.charCodeAt(i++);
			chr3 = input.charCodeAt(i++);
			enc1 = chr1 >> 2;
			enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
			enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
			enc4 = chr3 & 63;
			if (isNaN(chr2)) {
				enc3 = enc4 = 64;
			} else if (isNaN(chr3)) {
				enc4 = 64;
			}
			output = output + keyStr.charAt(enc1) + keyStr.charAt(enc2)
					+ keyStr.charAt(enc3) + keyStr.charAt(enc4);
			chr1 = chr2 = chr3 = "";
			enc1 = enc2 = enc3 = enc4 = "";
		} while (i < input.length);
		return output;
	}


</script>

<style>

</style>
